<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <script>
    // async&await语法使用：
    // — async定义函数
    // — await 后面所有的代码都变成异步的
    // — await 只等promise实例，其他的都不等
    // — await 后面如果跟一个成功的promise实例，函数继续执行，await返回与这个promise保持一致
    // — await 后面如果跟一个失败的promise实例，函数执行中断，退出出函数体。



    //定义一个async函数
    async function fn() {
      console.log(111);     // 1.调用函数，同步代码，输出 111

      await setTimeout(() => {           //2.await后面的都是异步代码，等待执行
        console.log(444);                 //9.定时器时间到,执行定时器，输出444
      }, 2000)

      console.log(333); //变成异步的       //3.await后面的都是异步代码，等待执行
                                        //8.await后面不是promise实例，不需要等，先输出333
      //此处await后面时promise实例，所以后面的输出代码要等到这个promise实例执行完才能执行
      await new Promise((resolve, reject) => {     //4.await后面的都是异步代码，等待执行
        setTimeout(()=>{
          console.log(555);                       //10.定时器时间到，输出5555
          resolve()
        },4000)
      })

      console.log(666);                      //5.await后面的都是异步代码，等待执行........
    }                                         //11.等await后的promise实例执行完了，才能执行，输出666

    fn()
    console.log(222);           //6.函数调用完，执行同步代码，输出 222



    //1-11   输出顺序是  111  222  333   444(2s后)   555(再过2s后)   666
  </script>
</body>

</html>